<template>
    <div class="login-page">
      <div class="login-box">
        <div>
          <el-input v-model="formData.userName" size="mini"/>
        </div>
        <div>
          <el-input v-model="formData.passWord" size="mini"/>
        </div>
        <div>
          <el-button type="primary" @click="buttonClick('confirm')">登录</el-button>
          <el-button @click="buttonClick('cancel')">取消</el-button>
        </div>
      </div>
    </div>
</template>

<script>
import { setToken } from '@/utils/auth'

export default {
  name: 'loginPage',
  data () {
    return {
      formData: {
        userName: '',
        passWord: ''
      }
    }
  },
  methods: {
    buttonClick (prop) {
      console.log('prop:', prop)
      switch (prop) {
        case 'confirm':
          setToken('jht123')
          this.$router.push('/homePage')
          break
        case 'cancel':
          break
      }
    }
  }
}
</script>

<style lang="scss" scoped>
  .login-page {
    width: 100%;
    height: 100%;
    position: relative;
    display: flex;
    justify-content: center;
    .login-box{
      width: 500px;
      height: 600px;
      background: #ccc;
      margin-top: 30px;
      .el-input{
        width: 200px;
      }
    }
  }
</style>